<template>
  <div>
  <h2>排房信息列表</h2>
    <div>
      房型名称:<input type="text">
      状态:<input type="radio">启用
      <input type="radio" >禁用
      <input type="button" value="查询" class="btn btn-primary">
    </div>
    <table class="table table-bordered">
      <thead>
        <tr>
          <td>房型名称</td>
          <td>价格</td>
          <td>房间数</td>
          <td>状态</td>
          <td>房间号</td>
          <td>操作</td>
        </tr>
      </thead>
      <tbody>
      <tr>
        <td>大床房</td>
        <td style="color: red">￥128.00</td>
        <td>3</td>
        <td>启用</td>
        <td>201,202,202</td>
        <td>
          <input type="button" value="修改" class="btn btn-primary" @click="upt">
          <input type="button" value="删除" class="btn btn-danger" @click="del">
          <input type="button" value="停用" class="btn btn-warning">
        </td>
      </tr>
      <tr>
        <td>双床房</td>
        <td style="color: red">￥118.00</td>
        <td>2</td>
        <td>启用</td>
        <td>222,223</td>
        <td>
          <input type="button" value="修改" class="btn btn-primary" @click="upt">
          <input type="button" value="删除" class="btn btn-danger" @click="del">
          <input type="button" value="停用" class="btn btn-warning">
        </td>
      </tr>
      <tr>
        <td>特价房</td>
        <td style="color: red">￥78.00</td>
        <td>3</td>
        <td>启用</td>
        <td>208,206,201</td>
        <td>
          <input type="button" value="修改" class="btn btn-primary" @click="upt">
          <input type="button" value="删除" class="btn btn-danger" @click="del">
          <input type="button" value="停用" class="btn btn-warning">
        </td>
      </tr>
      </tbody>
    </table>
  </div>
  <div>
    共<b style="color: red">8</b>条数据
    共<b style="color: red">3</b>页
    <input type="button" value="首页" class="btn btn-info">
    <input type="button" value="上一页" class="btn btn-info">
    <input type="button" value="下一页" class="btn btn-info">
    <input type="button" value="尾页" class="btn btn-info">
  </div>
</template>

<script setup lang="ts">
import {ref,reactive,onMounted} from 'vue';
import axios from "axios";
import {useRouter,useRoute} from 'vue-router';
const router = useRouter();
const route = useRoute();

const upt = () => {
  router.push('/UptHouse');
}
const del = () => {
  alert('你确定要删除么');
}
</script>

<style scoped>

</style>